<template>
    <div class="app-container purchase-in-list-page">
        <FilterForm
            :data="filterData"
            label-width="85px"
            ref="FilterForm"
            @search="getList"
        />
        <el-row :gutter="10" class="opr-btn-group mb8">
            <el-col :span="1.5">
                <el-button
                    type="primary"
                    plain
                    icon="el-icon-plus"
                    size="mini"
                    @click="handleAdd"
                    v-hasPermi="['woodPurchase:purchaseOrder:add']"
                    >新增</el-button
                >
            </el-col>
            <el-col :span="1.5">
                <el-button
                    type="danger"
                    plain
                    icon="el-icon-delete"
                    size="mini"
                    :disabled="multiple"
                    @click="handleDelete"
                    v-hasPermi="['woodPurchase:woodPurchaseIn:remove']"
                    >删除</el-button
                >
            </el-col>
            <el-col :span="1.5">
                <el-button
                    type="warning"
                    plain
                    icon="el-icon-download"
                    size="mini"
                    :loading="exportLoading"
                    @click="handleExport"
                    v-hasPermi="['woodPurchase:woodPurchaseIn:export']"
                    >导出</el-button
                >
            </el-col>
            <el-col :span="1.5">
                <el-button
                    type="success"
                    plain
                    size="mini"
                    @click="handleAudit(1)"
                    v-hasPermi="['woodPurchase:woodPurchaseIn:edit']"
                    >审核</el-button
                >
            </el-col>
            <el-col :span="1.5">
                <el-button
                    type="success"
                    plain
                    size="mini"
                    @click="handleAudit(0)"
                    v-hasPermi="['woodPurchase:woodPurchaseIn:edit']"
                    >反审核</el-button
                >
            </el-col>
        </el-row>

        <Table
            :api="$Api.woodPurchase.in.list"
            :selection="true"
            @select="handleSelectionChange"
            @dbClick="rowDblclick"
            height="calc(100vh - 400px)"
            ref="woodPurchaseInTable"
        >
            <el-table-column
                width="130"
                label="操作"
                align="center"
                class-name="small-padding fixed-width"
                fixed="left"
            >
                <template slot-scope="scope">
                    <el-button
                        size="mini"
                        type="text"
                        icon="el-icon-edit"
                        @click="handleUpdate(scope.row)"
                        v-hasPermi="['woodPurchase:woodPurchaseIn:edit']"
                        >修改</el-button
                    >
                    <el-button
                        size="mini"
                        type="text"
                        icon="el-icon-delete"
                        @click="handleDelete(scope.row)"
                        v-hasPermi="['woodPurchase:woodPurchaseIn:remove']"
                        >删除</el-button
                    >
                </template>
            </el-table-column>

            <el-table-column
                label="入库日期"
                width="120"
                align="center"
                prop="inTime"
            />
            <el-table-column
                label="到港日期"
                width="120"
                align="center"
                prop="arriveTime"
            />
            <el-table-column
                label="装运日期"
                width="120"
                align="center"
                prop="shippingTime"
            />
            <el-table-column
                label="品名"
                width="120"
                align="center"
                prop="goodsName"
            >
                <template slot-scope="scope" v-if="scope.row.goodsName">
                    <span>{{ JSON.parse(scope.row.goodsName).join() }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="品牌"
                width="120"
                align="center"
                prop="brandName"
            >
                <template slot-scope="scope" v-if="scope.row.brandName">
                    <span>{{ JSON.parse(scope.row.brandName).join() }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="仓库"
                width="120"
                align="center"
                prop="warehouse"
            >
                <template slot-scope="scope" v-if="scope.row.warehouse">
                    <span>{{ JSON.parse(scope.row.warehouse).join() }}</span>
                </template>
            </el-table-column>
            <el-table-column
                label="开证合同"
                width="200"
                align="center"
                prop="pactNum"
            />
            <el-table-column
                label="提单号"
                width="200"
                align="center"
                prop="ladingNum"
            />
            <el-table-column
                label="开证公司"
                width="200"
                align="center"
                prop="pactName"
            />
            <el-table-column
                label="方数"
                align="center"
                width="120"
                prop="count"
            />
            <el-table-column
                label="金额"
                align="center"
                width="120"
                prop="money"
            />
            <el-table-column label="港口" align="center" prop="harbor" />
            <el-table-column label="柜数" align="center" prop="caseCount" />
            <el-table-column
                label="供应商"
                align="center"
                width="200"
                prop="supplierName"
            />
            <el-table-column
                label="关联订单号"
                align="center"
                prop="orderId"
                width="120"
            />
            <el-table-column label="制单人" align="center" prop="createBy" />
            <el-table-column
                label="审核人"
                align="center"
                prop="updateBy"
                fixed="right"
            >
                <template slot-scope="scope">
                    <span>{{
                        scope.row.auditStatus == 1 ? scope.row.updateBy : ""
                    }}</span>
                </template>
            </el-table-column>
            <el-table-column label="审核状态" align="center" fixed="right">
                <template slot-scope="scope">
                    <span class="success" v-if="scope.row.auditStatus == 1"
                        >已审核</span
                    >
                    <span class="error" v-else>未审核</span>
                </template>
            </el-table-column>

            <el-table-column
                label="备注"
                align="center"
                prop="remark"
                width="300"
            >
                <template slot-scope="scope">
                    <span class="text-ellipsis" :title="scope.row.remark">{{
                        scope.row.remark
                    }}</span>
                </template>
            </el-table-column>
        </Table>
    </div>
</template>

<script>
import {
    delPurchaseOrder,
    addPurchaseOrder,
    updatePurchaseOrder,
    exportPurchaseOrder,
} from "@/api/business/woodPurchase/purchaseOrder";

export default {
    name: "PurchaseOrder",
    components: {},

    data() {
        return {
            filterData: [
                {
                    label: "入库日期",
                    type: "period_date",
                    st: "beginInTime",
                    end: "endInTime",
                    scale: 2,
                },
                {
                    label: "到港日期",
                    type: "period_date",
                    st: "beginArriveTime",
                    end: "endArriveTime",
                    scale: 2,
                },
                {
                    label: "提单号",
                    name: "ladingNum",
                },
                {
                    label: "品名",
                    name: "goodsName",
                    type: "select",
                    select: "goodsName",
                },
                {
                    label: "仓库",
                    name: "warehouse",
                    type: "select",
                    select: "warehouse",
                },
                {
                    label: "开证公司",
                    name: "pactName",
                    type: "supplier",
                },
                {
                    label: "开证合同",
                    name: "pactNum",
                },
                {
                    label: "供应商",
                    name: "supplierName",
                    type: "supplier",
                },
                {
                    label: "审核状态",
                    name: "auditStatus",
                    type: "select",
                    select: "audit",
                },
                {
                    label: "入库状态",
                    name: "auditStatus",
                    type: "select",
                    select: "inState",
                },
            ],
            // 遮罩层
            loading: true,
            // 导出遮罩层
            exportLoading: false,
            // 选中数组
            ids: [],
            // 子表选中数据
            checkedWoodPurchaseOrderGoods: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true,
            // 显示搜索条件
            showSearch: true,
            // 总条数
            total: 0,
            // 采购订单信息表格数据
            purchaseOrderList: [],
            // 采购订单商品列表表格数据
            woodPurchaseOrderGoodsList: [],
            // 弹出层标题
            title: "",
            // 是否显示弹出层
            open: false,
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
                beginInTime: "",
                endInTime: "",
                beginArriveTime: "",
                endArriveTime: "",
                ladingNum: "",
                goodsName: "",
                warehouse: "",
                pactName: "",
                pactNum: "",
                supplierName: "",
                auditStatus: "",
            },
            // 表单参数
            form: {},
            // 表单校验
            rules: {
                delFlag: [
                    {
                        required: true,
                        message: "删除标志;不能为空",
                        trigger: "blur",
                    },
                ],
            },
        };
    },
    mounted() {
        // let { query } = this.$route;
        // let {FilterForm} =  this.$refs;
        // FilterForm.set(query);
        // FilterForm.search(true);
    },
    methods: {
        handleAudit(auditStatus) {
            let { ids } = this;

            if (!ids.length) {
                this.$message.error("请至少选择一条记录");
                return false;
            }

            this.$Api.woodPurchase.in
                .Audit({
                    auditStatus,
                    arrayInIds: ids,
                })
                .then((res) => {
                    this.$message.success(res.msg);
                    this.getList();
                });
        },
        /** 查询采购订单信息列表 */
        getList(params) {
            this.$refs.woodPurchaseInTable.getData(params);
        },
        // 取消按钮
        cancel() {
            this.open = false;
            this.reset();
        },
        // 表单重置
        reset() {
            this.form = {
                beginInTime: "",
                endInTime: "",
                beginArriveTime: "",
                endArriveTime: "",
                ladingNum: "",
                goodsName: "",
                warehouse: "",
                pactName: "",
                pactNum: "",
                supplierName: "",
                auditStatus: "",
            };
            this.woodPurchaseOrderGoodsList = [];
            this.resetForm("queryForm");
        },
        /** 搜索按钮操作 */
        handleQuery() {
            this.queryParams.pageNum = 1;
            this.getList();
        },
        /** 重置按钮操作 */
        resetQuery() {
            this.resetForm("queryForm");
            this.handleQuery();
        },
        // 多选框选中数据
        handleSelectionChange(selection) {
            this.ids = selection.map((item) => item.inId);
            this.single = selection.length !== 1;
            this.multiple = !selection.length;
        },
        // 选中行选中复选框
        handleRowClick(row, column, event) {
            this.$refs.woodPurchaseInTable.toggleRowSelection(row);
        },
        /** 新增按钮操作 */
        handleAdd() {
            this.$router.push({
                path: "/purchase/invoice/putInstorage",
            });
        },
        // 双击操作
        rowDblclick(row, column, event) {
            this.handleUpdate(row);
        },
        /** 修改按钮操作 */
        handleUpdate(row) {
            const id = row.inId;
            let path = `/purchase/putInstorage/detail/${id}`;
            this.$router.push({
                path,
            });
        },
        /** 提交按钮 */
        submitForm() {
            this.$refs["form"].validate((valid) => {
                if (valid) {
                    this.form.woodPurchaseOrderGoodsList =
                        this.woodPurchaseOrderGoodsList;
                    if (this.form.orderId != null) {
                        updatePurchaseOrder(this.form).then((response) => {
                            this.msgSuccess("修改成功");
                            this.open = false;
                            this.getList();
                        });
                    } else {
                        addPurchaseOrder(this.form).then((response) => {
                            this.msgSuccess("新增成功");
                            this.open = false;
                            this.getList();
                        });
                    }
                }
            });
        },
        /** 删除按钮操作 */
        handleDelete(row) {
            const inIds = row.inId ? [row.inId] : this.ids;
            this.$confirm(
                '是否确认删除采购订单信息编号为"' + inIds.join() + '"的数据项?',
                "警告",
                {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning",
                }
            ).then(() => {
                this.$Api.woodPurchase.in.del(inIds.join()).then((res) => {
                    this.msgSuccess(res.msg);
                    this.getList();
                });
            });
        },
        /** 采购订单商品列表序号 */
        rowWoodPurchaseOrderGoodsIndex({ row, rowIndex }) {
            row.index = rowIndex + 1;
        },
        /** 采购订单商品列表添加按钮操作 */
        handleAddWoodPurchaseOrderGoods() {
            let obj = {};
            obj.itemId = "";
            obj.goodsName = "";
            obj.brandName = "";
            obj.level = "";
            obj.ply = "";
            obj.width = "";
            obj.length = "";
            obj.buyCount = "";
            obj.wayCount = "";
            obj.inCount = "";
            obj.price = "";
            obj.money = "";
            obj.warehouse = "";
            obj.remark = "";
            this.woodPurchaseOrderGoodsList.push(obj);
        },
        /** 采购订单商品列表删除按钮操作 */
        handleDeleteWoodPurchaseOrderGoods() {
            if (this.checkedWoodPurchaseOrderGoods.length == 0) {
                this.$alert("请先选择要删除的采购订单商品列表数据", "提示", {
                    confirmButtonText: "确定",
                });
            } else {
                this.woodPurchaseOrderGoodsList.splice(
                    this.checkedWoodPurchaseOrderGoods[0].index - 1,
                    1
                );
            }
        },
        /** 单选框选中数据 */
        handleWoodPurchaseOrderGoodsSelectionChange(selection) {
            if (selection.length > 1) {
                this.$refs.woodPurchaseOrderGoods.clearSelection();
                this.$refs.woodPurchaseOrderGoods.toggleRowSelection(
                    selection.pop()
                );
            } else {
                this.checkedWoodPurchaseOrderGoods = selection;
            }
        },
        /** 导出按钮操作 */
        handleExport() {
            const queryParams = this.queryParams;
            this.$confirm("是否确认导出所有采购订单信息数据项?", "警告", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            })
                .then(() => {
                    this.exportLoading = true;
                    return exportPurchaseOrder(queryParams);
                })
                .then((response) => {
                    this.download(response.msg);
                    this.exportLoading = false;
                })
                .catch(() => {});
        },
    },
};
</script>



<style lang="scss" scoped>
::v-deep.purchase-in-list-page {
    .success {
        color: #67c23a;
    }
    .error {
        color: #f56c6c;
    }
    user-select: none;
    .el-table__fixed::before,
    .el-table__fixed-right::before {
        display: none;
    }
    .form-item-date {
        margin-right: 10px;
        b {
            margin: 0 10px;
            display: inline-block;
            font-weight: normal;
        }
    }
}
</style>